<template>
    <div>
      <vm-common-header
        :pageTitle="pageTitle"
        :goBack="goBack"></vm-common-header>
      <div class="vm-common-offer-container">
        <!-- 公共UL详情页头部 start -->
        <vm-common-details-ul-title
        :Codes="cProductCodes"
        :Title="mTitle"></vm-common-details-ul-title>
        <!-- 公共UL详情页头部 end -->
        <div class="vm-common-offer-body">
          <div class="vm-myOffer-item-box" v-for="(item, key) in offerDetailsData" :key="key">
            <div class="vm-myOffer-item-l">
              <div class="vm-myOffer-offerTime">
                <span>报价时间：</span>
                <em>{{ item.offerTime }}</em>
              </div>
              <div class="vm-myOffer-enclosure">
                <span>附件：（点击下载）</span>
                <div class="pl30">
                  <a :href="'http://www.vocoor.cn' + item.fileUrl">
                    <p>{{ item.fileName }}</p>
                  </a>
                </div>
              </div>
            </div>
            <div class="vm-myOffer-item-r">
              <div class="vm-myOffer-totalMoney">
                <span>总价</span>
                <em class="money">￥{{ item.fBidsTotal }}</em>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
</template>

<script>
  import vmCommonHeader from '@/components/vm-common-header' // header 组件
  import vmCommonDetailsUlTitle from '@/components/vm-common-item/vm-common-DetailsUlTitle' // 公共详情页UL标题
  import { participatedetail } from '@/api/my_offer.js'
export default {
  data () {
    return {
      pageTitle: this.$route.meta.pageTitle,
      goBack: this.$route.meta.goBack,
      offerId: this.$route.params.id,
      offerDetailsData: new Array(),
      cProductCodes: '',
      mTitle: ''
    }
  },
  created () {
    // 获取报价详情数据
    this.participatedetailData();
  },
  methods: {
    participatedetailData () {
      participatedetail(this.offerId).then(res => {
        this.offerDetailsData = res.data.data;
        this.cProductCodes = this.offerDetailsData[0].cProductCodes;
        this.mTitle = this.offerDetailsData[0].mTitle;
      })
    }
  },
  components: {
    'vm-common-header': vmCommonHeader,
    'vm-common-details-ul-title': vmCommonDetailsUlTitle
  }
}
</script>

<style lang="scss" scoped>
.vm-common-offer-container {
  width: 100%;
  height: 100%;
  overflow: auto;
  .vm-common-offer-body {
    padding: 40px;
  }
}
</style>
